<template>
	<view class="container">
		<!-- 内容区域包装器 -->
		<view class="content-wrapper">
			<!-- 搜索区域 -->
			<view class="search-box">
				<u-search placeholder="请输入关键搜索"  v-model="fromData.kw" :show-action="false" :clearabled="true" :animation="false"
					shape="round" bgColor="#FFFFFF" height="72rpx" searchIconColor="#999999" placeholderColor="#999999" @change="changekeword"
					:inputStyle="{
						color: '#333333',
						backgroundColor: '#FFFFFF',
					}"></u-search>
			</view>
		</view>
		<!-- 短信记录 -->
		<view class="content-box"> 
			<view class="u-m-20  record" v-for="item in list">
				<view class="t0">
					{{item.content}}
				</view>
				<view class="t1">
					手机号：{{item.mobile}}
				</view>
				<view class="t2">
					日期：{{item.create_time_text}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>

import { send_log } from '@/api/landlord.js'
export default {
	data() {
		return {
			list: [],
			fromData: {
				page: 1,
				page_size: 10,
				kw:''
			},
			total:0
		};
	},
	onLoad(options) {
		this.init()
		console.log(8888);
	},
	async onReachBottom() {
		if(this.list.length < this.total) {
			this.formData.page++
			this.init()
		}
	},
	methods: {
		changekeword(){
			this.list = []
			this.fromData.page = 1
			this.init()
		},
		init() {
			send_log(this.fromData).then(res => {
				console.log("短信记录",res.data);
				res.data.data.data.forEach((item) => {
					this.list.push(item)
				})
				this.total = res.data.data.total
			})
		},
	},
	onReady() {
		// 微信小程序需要用此写法
	},
};
</script>

<style lang="less" scoped>
.container {
	min-height: 100vh;
	background-color: #f5f6fa;
}

.search-box {
	padding: 24rpx 32rpx;

	:deep(.u-search) {
		background-color: #ffffff !important;
		border-radius: 36rpx;
		box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.05);

		.u-search__content {
			background-color: #ffffff !important;
			height: 72rpx;
			padding: 0 30rpx;

			.u-search__content__icon {
				margin-right: 8rpx;
			}

			.u-search__content__input {
				font-size: 28rpx;
			}
		}
	}
}
.font-color-red{
	color: red;
}
.record {
	// width: 100%;
	box-sizing: border-box;
	padding:20rpx;
	border-radius: 20rpx;
	background-color: #fff;
	font-size:26rpx;
	line-height: 50rpx;
}
</style>